<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ page import="model.beans.Topic" %>    
<%@ page import="java.util.List" %>   
<%@ page import="service.Service" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no"">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->

    <title >所有话题</title>
    <!-- 1.9.1的JQuery文件 -->
    <script src="https://cdn.bootcss.com/jquery/1.9.1/jquery.js"></script>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    <link href="css/index.css" rel="stylesheet">    <!-- 不能直接引用该文件 -->
    <link href="css/lljk.css" rel="stylesheet">
    <link href="css/hw.css" rel="stylesheet">
    <link rel="shortcut icon" href="images/pageLogo.ico" />
    <!-- 字体链接 -->
    <link href='http://cdn.webfont.youziku.com/webfonts/nomal/107163/19607/59a17d22f629d811947c75cd.css' rel='stylesheet' type='text/css' />

<!-- <script src="js/snow.js">
</script> -->
<!-- 圣诞节限时雪花效果-结束 -->
</head>

  <body style="padding-top:94px;">



		<!-- Modal -->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
		  <div class="modal-dialog" role="document">
		    <div class="modal-content">
		      <div class="modal-header">
		        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
		        <h4 class="modal-title" id="myModalLabel">请输入口令</h4>
		      </div>
		      <form method="post" action="servlet/DeleteTopicServlet" onsubmit="return updateAction(this);">
			      <div class="modal-body">		        
			        	<input class="form-control" name="pwd" />		        
			      </div>
			      <div class="modal-footer">
			        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
			        <button type="submit" class="btn btn-primary">确定</button>
			      </div>
		      </form>
		    </div>
		  </div>
		</div>


        <!-- 导航条 -->
        <nav class="navbar navbar-default navbar-inverse navbar-fixed-top" id="navigation">
          <div class="container-fluid">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
              <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#main-menu" >
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
              </button>
              <a class="navbar-brand" style="font-family:'hdjxingshucc3fa15f21a29b'; color:white;">琳琅工作室</a> 
              <img class="visible-md visible-lg"  src="images/LOGO_S.png" style="position:absolute;height:70%;left:2%;top:4%;">  
            </div><!--  /navbar-header -->

           <div class="collapse navbar-collapse" id="main-menu">
            <ul class="nav navbar-nav navbar-form navbar-right" id="nav-form">
              <li><a href="index.html"><span class="glyphicon glyphicon-asterisk"> </span>琳琅首页</a></li>
              <li><a href="allTopic.jsp"><span class="glyphicon glyphicon-road"> </span> 查看所有话题</a></li>
              <li><a href="publish.jsp"><span class="glyphicon glyphicon-magnet"> </span>发布话题</a></li>
              <form action="info.jsp" method="get" ><input type="text" class="form-control visible-xs" placeholder="QQ号搜索话题" aria-describedby="basic-addon1" name="qq" ></form>
            </ul>
            </div><!-- /collapse navbar-collapse -->
          </div><!-- /container-fluid -->
        </nav>
        <%!String[] panelStyle={"panel-default","panel-success","panel-warning","panel-info","panel-danger"}; %>
		<%!List<Topic> topicList = null; %>
		<%	
			topicList = (new Service()).queryAllTopic();
			if(topicList.isEmpty()==true){
			    out.flush();//清空缓存
			    out.println("<script>");//输出script标签
			    out.println("alert('还没有人发布了话题哦');");//js语句：输出alert语句
			    out.println("history.back();");//js语句：输出网页回退语句
			    out.println("</script>");//输出script结尾标签
			}else{
		%>
		        <%for(int i=0;i<topicList.size();i++) {
		        	Topic t = topicList.get(i);
		        %>
		   <div class="container">
             <div class="panel <%=panelStyle[i%5] %>">
                <div class="panel-heading" role="tab" id="headingOne">
                  <h4 class="panel-title">
                    <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapse<%=i%>">
                      <%=t.getTitle()%>
                    </a>
                     <span onclick="setId(this);"  class="glyphicon glyphicon-remove pull-right" data-topicid=<%=t.getTopicId()%> data-toggle="modal" data-target="#myModal" ></span>
                  </h4>
                </div>

                  <div id="collapse<%=i %>" class="panel-collapse collapse" role="tabpanel">
                      <div class="panel-body">
                          <p><%=t.getContent() %></p>
                          <hr>
                          <span class="pull-right">
                            <span>QQ</span>&nbsp;&nbsp;
                                <span><%=t.getQq() %></span>
                            <br>
                            <span><%=t.getDate() %></span>
                          </span>
                      </div>
                </div>
              </div>
        </div> 
		        <%}%>
        <%}%>
<!-- CopyrightNotice -->
 <div id="CopyrightNotice" class="text-center">Copyright © 
        <a target="_blank" href="http://www.flyingocean.cn/" style="text-decoration:none">FlyingOcean</a>
 </div>
 <span><strong>累计访问量（PV）</strong></span>
<!-- GoStats JavaScript Based Code -->
<script type="text/javascript" src="http://gostats.cn/js/counter.js"></script>
<script type="text/javascript">_gos='monster.gostats.cn';_goa=494280;
_got=7;_goi=16;_goz=0;_god='hits';_gol='客流计数器';_GoStatsRun();</script>
<noscript><a target="_blank" title="客流计数器" 
href="http://gostats.cn"><img alt="客流计数器" 
src="http://monster.gostats.cn/bin/count/a_494280/t_7/i_16/z_0/show_hits/counter.png" 
style="border-width:0" /></a></noscript>
<!-- End GoStats JavaScript Based Code --> 

    <script language="javascript">
	 function setId(obj){
		selectedId = obj.dataset.topicid;
	 }
	 function updateAction(obj){
		 obj.action = obj.action+"?id="+selectedId;
		 console.log(obj.action);
		 return true;
	 }
	</script>
	

    </body>
    
    
</html>